<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
<head>
	<th:block th:include="include :: header('系统首页')"/>
	<link rel="stylesheet" th:href="@{/layuimini/css/other/person.css}">
	<style>
		/* 日历选中颜色  */
		.layui-laydate .layui-bg01 {
			background-color: #8de7ed !important;
			color: #fff !important;
		}

		.layui-laydate .layui-bg02 {
			background-color: #ccccff !important;
			color: #fff !important;
		}

		.layui-laydate .layui-bg03 {
			background-color: #ffadad !important;
			color: #fff !important;
		}

		.layui-laydate .layui-this {
			background-color: #22cdc9 !important;
			color: #fff !important;
		}

		.todoItem{
			padding: 0 1%;
			height: 31px;
			line-height: 31px;
		}
		.todoItem:hover{
			background-color: #d2d2d2;
		}
		.proMenuItem{
			min-height: 89px;
			cursor: pointer;
			margin: 5px;
		}
		.proMenuItem:hover{
			background-color: #d2d2d2;
		}
		.todoItem-title{
			float: left;
			margin-right: 10px;
			width: 45%;
			white-space:nowrap;
			overflow: hidden;
			text-overflow:ellipsis;
			word-break:keep-all;
		}
		.todoItem-date{
			text-align:right;
			min-width: 130px;
			float: right;
			white-space:nowrap;
		}
	</style>
</head>
	<body>

	<div class="layuimini-main">
		<div class="layui-row layui-col-space10">
			<div class="layui-col-md8">
				<div class="layui-row layui-col-space10">
					<div class="layui-col-md6">
						<div class="layui-card">
							<div class="layui-card-header">
								待办任务
								<span style="float: right;font-size: 10px">
									<span style="cursor: pointer;" onclick="initTodo()">刷新</span>
									<span><a target="_blank" th:href="@{/process/main}"> 更多>></a></span>
								</span>
							</div>
							<div class="layui-card-body" style="height: 180px;">
								<div class="layui-row layui-col-space10" id="todo">

								</div>
							</div>
						</div>
					</div>
					<div class="layui-col-md6">
						<div class="layui-card">
							<div class="layui-card-header">
								信息提醒
								<span style="float: right;font-size: 10px">
									<span style="cursor: pointer;" onclick="initNotice()">刷新</span>
									<span><a target="_blank" th:href="@{/system/notice/per_main}"> 更多>></a></span>
								</span>
							</div>
							<div class="layui-card-body" style="height: 180px;">
								<div class="layui-row layui-col-space10" id="notice">

								</div>
							</div>
						</div>
					</div>
					<div class="layui-col-md12">
						<div class="layui-card">
							<div class="layui-card-header">
								快捷菜单
								<a style="float: right; font-size: 10px; cursor: pointer;" data-title="快捷入口" th:data-url="@{/system/userPermissionSort/main}">编辑</a>
							</div>
							<div class="layui-card-body" style="height: 234px;text-align: center">
								<div class="layui-row layui-col-space10" id="proMenu">
								</div>
							</div>
						</div>
					</div>
					<div class="layui-col-md12">

					</div>
				</div>
			</div>
			<div class="layui-col-md4">
				<div class="layui-card">
					<div class="layui-card-body" style="">
						<div class="text-center layui-text">
							<div class="user-info-head" id="userInfoHead">
								<img th:src="@{/layuimini/images/avatar.jpg}" id="userAvatar" width="115px" height="115px" alt="">
							</div>
							<h2 style="font-size: 20px;" id="username">user</h2>
							<p style="font-size: 13.5px;" id="unitName">user</p>
						</div>
					</div>
					<div style="height: 25px;border-top: 1px whitesmoke solid;text-align: center;line-height: 25px;font-size: 13.5px;">
						<span>今日事 ，今日毕</span>
					</div>
				</div>

				<div class="layui-card">
					<div class="layui-card-body">
						<div style="text-align: center;">

							<div class="" id="test-n1"></div>

						</div>

					</div>
				</div>
			</div>
		</div>
		</div>
		<!--</div>-->
		<th:block th:include="include :: footer"/>
		<script>
			var timeAll = ["2022-5-31", "2022-6-1", "2022-6-2", "2022-6-3", "2022-7-1", "2022-7-24", "2022-7-29"]; //已交
			var timeIn = ["2022-5-30", "2022-6-6", "2022-6-7", "2022-6-8", "2022-7-9", "2022-7-10", "2022-7-11"]; //未交
			var timePart = ["2022-6-16", "2022-6-13", "2022-6-14", "2022-6-15",]; //补交
			layui.use(function () {
				window.name = "commonIndex";
				var laydate = layui.laydate;
				var $ = layui.jquery;
				let url = common.currentUser().headImgUrl;
				if(!!url && url != 'null'){
					var image = new Image();
					image.src = pName+ "/system/file/download/" + url;
					image.onload = function() {
						$("#userAvatar").attr("src", convert.imageToBase64(image));
					}

				}
				$('#username').text(common.currentUser().username + "|" + common.currentUser().userSn)
				$('#unitName').text(common.currentUser().unitName)

				$("#userAvatar").click(function () {
					parent.layui.miniTab.openNewTabByIframe({title: '个人信息', href: pName + '/system/user/person'});
				});

				$("body").on("click", "[data-url]", function() {
					parent.layui.miniTab.openNewTabByIframe({title:  $(this).attr("data-title"),href: $(this).attr("data-url")});
				})
				let map = new Map();
				map.set("beginYear", 2022);
				map.set("endYear", 2024);
				let mark = {};
				$.ajax({
					url: pName + '/system/festival/mark',
					type: 'get',
					data: {params: map},
					dataType: 'json',
					success: function (result) {
						if(result.code == 1){
							mark = result.data;
							var ins1 = laydate.render({
								elem: '#test-n1'
								, position: 'static'
								// , calendar: true
								, theme: '#22cdc9'
								, showBottom: false
								, ready: function (date) {
									// console.log(dates);
									$('.layui-laydate-content').find("td").each(function (i, e) {
										// console.log(dates.indexOf($(e).attr('lay-ymd')));
										if (timeAll.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg01');
										} else if (timeIn.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg02');
										} else if (timePart.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg03');
										}

									});
								}
								,mark: JSON.parse(mark)
								,done: function(value, date){
									if(date.year === 2023 && date.month === 8 && date.date === 15){ //点击2017年8月15日，弹出提示语
										ins1.hint('中国人民抗日战争胜利');
									}
								}
							});
							//回调 标记
							$('.laydate-next-y,.laydate-next-m,.laydate-prev-y,.laydate-prev-m,.laydate-set-ym,.layui-laydate-content').click(function () {
								$('.layui-laydate-content').find("td").each(function (i, e) {
									// console.log(dates.indexOf($(e).attr('lay-ymd')));
									if (!$(e).hasClass('layui-bg01')) {
										if (timeAll.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg01');
										}
										else if (timeIn.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg02');
										}
										else if (timePart.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg03');
										}
									}
								});
							});
						}else {
							var ins1 = laydate.render({
								elem: '#test-n1'
								, position: 'static'
								// , calendar: true
								, theme: '#22cdc9'
								, showBottom: false
								, ready: function (date) {
									// console.log(dates);
									$('.layui-laydate-content').find("td").each(function (i, e) {
										// console.log(dates.indexOf($(e).attr('lay-ymd')));
										if (timeAll.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg01');
										} else if (timeIn.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg02');
										} else if (timePart.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg03');
										}

									});
								}
								,done: function(value, date){
									if(date.year === 2023 && date.month === 8 && date.date === 15){ //点击2017年8月15日，弹出提示语
										ins1.hint('中国人民抗日战争胜利');
									}
								}
							});
							//回调 标记
							$('.laydate-next-y,.laydate-next-m,.laydate-prev-y,.laydate-prev-m,.laydate-set-ym,.layui-laydate-content').click(function () {
								$('.layui-laydate-content').find("td").each(function (i, e) {
									// console.log(dates.indexOf($(e).attr('lay-ymd')));
									if (!$(e).hasClass('layui-bg01')) {
										if (timeAll.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg01');
										}
										else if (timeIn.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg02');
										}
										else if (timePart.indexOf($(e).attr('lay-ymd')) >= 0) {
											$(e).addClass('layui-bg03');
										}
									}
								});
							});
						}

					}
				})
				window.show = function (title, url) {
					let layerIndex = top.layer.open({
						type: 2,
						title: title,
						shade: 0.1,
						maxmin: true,
						area: ['99%', '99%'],
						content: url,
						end: function() {
							window.initTodo();
							window.initNotice();
						}
					});
					$(window).on("resize", function () {
						layer.full(layerIndex);
					});
					return false;
				}
				window.initProMenu();
				window.initTodo();
				window.initNotice();
			});
			window.initProMenu = function (){
				$.ajax({
					url: pName + '/system/common/proMenu',
					type: 'get',
					dataType: 'json',
					success: function(result) {
						if(result.code == 1){
							result.data.forEach(function (d) {
								if(d.icon == null || d.icon == ""){
									d.icon = "fa fa-list";
								}
								$('#proMenu').append('<div class="proMenuItem layui-col-md2 layui-col-sm2 layui-col-xs2" data-id="'+d.id+'" data-title="'+d.name+'" data-url="'+d.href+'">' +
										'<div class="layui-card">' +
										'<i class="'+d.icon+'"></i>' +
										'</div>' +
										'<span class="layui-card-title">'+d.name+'</span>' +
										'</div>')
							})
						}
					}
				})
			}
			window.initTodo = function(){
				$('#todo').html("");
				$.ajax({
					url: pName + '/system/common/'+common.currentUser().id+'/todo',
					type: 'get',
					dataType: 'json',
					success: function(result) {
						if(result.code == 0 && result.data != null){
							result.data.forEach(function (d) {
								$('#todo').append('<div class="todoItem" onclick="window.show(\'待办\',\''+pName + '/process/forms/audit/' +d.id+'\')" style="cursor: pointer;">' +
										'<div >' +
										'<div class="todoItem-title">'+d.name+'</div>' +
										'<div class="todoItem-date">'+d.createTime+'</div>' +
										'</div>' +
										'</div>');
							})
						}
					}
				})
			}
			window.initNotice = function(){
				$('#notice').html("");
				$.ajax({
					url: pName + '/system/common/'+common.currentUser().id+'/notice',
					type: 'get',
					dataType: 'json',
					success: function(result) {
						if(result.code == 0){
							result.data.forEach(function (d) {
								$('#notice').append('<div class="todoItem" onclick="window.show(\'信息提醒\',\''+pName + '/system/common/notice/' +d.id+'\')" style="cursor: pointer;">' +
										'<div >' +
										'<div class="todoItem-title">'+d.title+'</div>' +
										'<div class="todoItem-date">'+d.createTime+'</div>' +
										'</div>' +
										'</div>');
							})
						}
					}
				})
			}

		</script>
	</body>
</html>
